<!-- 还款申请详情-->
<template>
	<view class="content">
		<view class="content-content">
			<text class="content-tile">北京中煤华远经销公司</text>
			<view class="content-img" @tap="gitLocation">
				<img src="/static/index/dateimg.png" alt="" />
				<view class="content-sign">
					<view class="sign-date">{{textContent}}</view>
					<view class="sign-location">签到</view>
				</view>
			</view>
			<view class="content-date">
				<view>签到时间：{{presentDate}}</view>
				<view>定位：{{address}}</view>
				<uni-easyinput type="textarea" v-model="from.bankName" placeholder="请输入"></uni-easyinput>
			</view>
		</view>
		<view class="submit-box">
			<view class="submit-cancel" @tap="backFun">取消</view>
			<view class="submit-bottom" @tap="submitFun">立即提交</view>
		</view>
	</view>
</template>

<script>
	var js;
	export default {
		onUnload() {
			this.clear()
		},
		data() {
			return {
				presentDate: '--',
				address: '--',
				isgetDate: '',
				textContent: "00:00:00",
				from: {
					bankName: '',
				},
			};
		},
		mounted() {

		},
		onShow() {
			this.updateClock()
		},
		methods: {
			updateClock() {
				var now = new Date(); // 获取当前时间
				var year = now.getFullYear(); // 获取当前年份
				var month = now.getMonth() + 1; // 获取当前月份，注意getMonth()返回的是0-11，所以需要加1
				var day = now.getDate(); // 获取当前日期
				var hours = now.getHours(); // 小时
				var minutes = now.getMinutes(); // 分钟
				var seconds = now.getSeconds(); // 秒钟
				// 确保时间数字不会超过2位数
				hours = (hours < 10 ? "0" : "") + hours;
				minutes = (minutes < 10 ? "0" : "") + minutes;
				seconds = (seconds < 10 ? "0" : "") + seconds;
				this.isgetDate = year + "-" + month + "-" + day
				// 更新显示时间的元素
				this.textContent = hours + ":" + minutes + ":" + seconds;
				js = setInterval(this.updateClock, 1000);
			},
			gitLocation() {
				var _this = this
				this.presentDate = this.isgetDate + " " + this.textContent
				uni.chooseLocation({
					success: function(res) {
						console.log(res.address)
						_this.address = res.address
					}
				});
			},
			clear() {
				clearInterval(js)
				js = null
				this.textContent = "00:00:00"
			},
			backFun() {
				uni.navigateBack({
					'delta': 1
				})
			},
			submitFun() {
				uni.navigateBack({
					'delta': 1
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		height: 100%;
		padding-left: 25rpx;
		padding-right: 25rpx;
	}

	.content-content {
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		align-items: center;
		background: #ffffff;
		height: 1025rpx;
		margin-top: 25rpx;
	}

	.content-tile {
		font-size: 37rpx;
		color: #000000;
		text-align: center;
		font-weight: 600;
	}

	.content-img {
		position: relative;
	}

	.content-sign {
		position: absolute;
		text-align: center;
		top: 111rpx;
		left: 56rpx;
	}

	.sign-location {
		font-size: 32rpx;
		color: #FFFFFF;
		letter-spacing: 0.5px;
		text-align: center;
		font-weight: 400;
	}

	.content-img img {
		height: 300rpx;
		width: 300rpx;
	}

	.submit-box {
		position: fixed;
		bottom: 0;
		/* 固定在视口底部 */
		left: 0;
		/* 固定在视口左边 */
		height: 192rpx;
		width: 100%;
		background: #FFFFFF;
		box-shadow: 0rpx 7rpx 14rpx 0rpx rgba(60, 92, 170, 0.06);
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.submit-bottom {
		height: 89rpx;
		width: 300rpx;
		line-height: 89rpx;
		background: #315EFB;
		border-radius: 49rpx;
		font-size: 32rpx;
		color: #FFFFFF;
		text-align: center;
		font-weight: 400;
		margin-left: 48rpx;
	}

	.submit-cancel {
		height: 89rpx;
		width: 300rpx;
		line-height: 89rpx;
		font-size: 32rpx;
		color: #999999;
		text-align: center;
		font-weight: 400;

		background: #FFFFFF;
		border: 1px solid rgba(153, 153, 153, 1);
		border-radius: 49px;
	}

	.content-date {
		width: 606rpx;
	}

	.sign-date {
		font-size: 52rpx;
		color: #FFFFFF;
		text-align: center;
		font-weight: 600;
	}

	.content-date view {
		font-size: 32rpx;
		color: #666666;
		font-weight: 400;
		margin-bottom: 20rpx;
	}
</style>